<%--
  Created by IntelliJ IDEA.
  User: Administrator
  Date: 2019/10/8
  Time: 20:48
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>课程类别</title>
    <%@include file="../../common/header.jsp"%>
    <%@include file="../../common/ruoyi.jsp"%>

    <script>
        var pager;
        var layer;
        $(function () {
            layui.use('layer',function () {
                layer=layui.layer;
            });
        });
        function queryAll(pageNo){
            $.ajax({
                type:"post",
                url:"${pageContext.request.contextPath}/courseType.action?method=queryAll&pageNo="+pageNo,
                data:$("#course-form").serialize(),
                dataType:"json",
                success:function (msg) {
                    $("#tb_cou1").empty();
                    var list=msg.data;
                    for (var i = 0; i < list.length; i++) {
                        var tr="<tr>" +
                            "<td>"+list[i].id+"</td>"+
                            "<td>"+list[i].type_name+"</td>"+
                            "<td>"+$("#op").html().replace('{cid}',list[i].id ).replace('{tid}',list[i].id )+"</td>"+
                            "</tr>";
                        $("#tb_cou1").append(tr);
                    }
                    pager = msg;
                    $("#sp").html("当前页:"+pager.pageNo+"/总页数:"+pager.pages);
                    $("#pageNo1").val(pager.pagerNo);
                    $("#pagerNo1").attr("max",pager.pages);
                },error:function(e){
                    alert(e);
                }
            });
        }

        //添加前初始化模态框表单
        function sub_add(id){
            $("#form1")[0].reset();
        }



        /**
         * 课程录入及修改
         */
        function add(){
            $.ajax({
                url:"${pageContext.request.contextPath}/courseType.action?method=add",
                type:"post",
                data:$("#form1").serialize(),
                dataType:"json",
                success:function(data){
                    layer.msg("课程类型添加或修改成功")
                    queryAll(1);
                },
                error:function (x,s,e) {
                    alert("错误："+s+e);
                }
            });

        }


        //修改前的查询
        function queryOne(id){
            $.ajax({
                url:"${pageContext.request.contextPath}/courseType.action?method=queryOne&id="+id,
                type:"post",
                dataType:"json",
                success:function (data) {
                    $("#id").val(data.id);
                    $("#type_name").val(data.type_name);
                },error:function (e) {
                    alert(e);
                }
            });
        }


        //删除
        function course_delete(id){
            $.ajax({
                url:"${pageContext.request.contextPath}/courseType.action?method=delete&id="+id,
                type:"post",
                dataType:"json",
                success:function(data){
                    layer.msg("删除成功")
                    queryAll(1);
                },
                error:function (xhr,s,e) {
                    alert("错误："+xhr+s+e);
                }
            });
        }


      $(function () {
          queryAll(1);
      })
    </script>
</head>
<body>
<div class="container-div">
    <div class="row">
        <div class="col-sm-12 search-collapse">
            <div class="col-sm-12 select-table table-striped">
                <input type="button" id="btn" class="btn btn-success" value="录入" onclick="sub_add()" data-toggle="modal" data-target="#myModal">
                <table class="table table-bordered table-hover">
                    <caption>课程信息</caption>
                    <thead>
                    <tr>
                        <td>编号</td>
                        <td>类型名称</td>
                        <td>操作</td>
                    </tr>
                    </thead>
                    <tbody id="tb_cou1">

                    </tbody>
                </table>


                <div id="page">
                    <ul class="pagination">
                        <li><span id="sp"></span></li>
                        <li><a href="javascript:void(0)" onclick="queryAll(1)">首页</a></li>
                        <li><a href="javascript:void(0)" onclick="queryAll(pager.prev)">上页</a></li>
                        <li><a href="javascript:void(0)" onclick="queryAll(pager.next)">下页</a></li>
                        <li><a href="javascript:void(0)" onclick="queryAll(pager.last)">尾页</a></li>
                        <li class="input-group">
                            <input type="number" value="" id="pageNo1" min="1"  step="1"/>
                            <input type="button" value="go" id="btnGo"/>
                        </li>
                    </ul>
                </div>
            </div>
        </div>
    </div>
</div>

<script type="text/html" id="op">
    <div class="hidden-sm hidden-xs action-buttons">
        <a class="green" href="#" onclick="queryOne({cid})" data-toggle="modal" data-target="#myModal">
            <i class="ace-icon fa fa-pencil "></i>修改
        </a>
        <a class="red" href="#" onclick="course_delete({tid})">
            <i class="ace-icon fa fa-trash-o "></i>删除
        </a>
    </div>
</script>


<!--模态框-->
<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
    <div class="modal-dialog" style="z-index: 5000">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
                <h4 class="modal-title" id="myModalLabel">课程</h4>
            </div>
            <div class="modal-body">
                <%--类型录入修改--%>
                <form role="form" id="form1" action="dept.action" >
                    <div class="form-group">
                        <%--编号--%>
                        <input type="text" class="form-control" id="id" name="id" />
                        <label for="type_name">类型名称</label><input type="text" class="form-control " id="type_name" name="type_name" />
                    </div>
                </form>
                <%--类型录入修改--%>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
                <button type="button" class="btn btn-primary" id="btnSubmit" onclick="add()" data-toggle="modal" data-target="#myModal">提交更改</button>
            </div>
        </div><!-- /.modal-content -->
    </div><!-- /.modal -->
</div>
</body>
</html>
